MARQUEE - Scrolling Text

Internet Explorer Only

Syntax:

<MARQUEE>...</MARQUEE>

Attribute Specifications:

ID=string
CLASS=string
STYLE=string
TITLE=string
LANGUAGE=[ JScript | javascript | vbs | vbscript | XML | any browser-supported language ]
LANG=Language (i.e. RU - Russian)
ALIGN=[ top | middle | bottom | left | right ]
BACKGROUND=url
BEHAVIOR=[ alternate | scroll | slide ]
BGCOLOR=Color
CLASS= string
DIRECTION=[ left | right | up | down ]
WIDTH=Length (image width)
HEIGHT=Length
HSPACE=Pixels
VSPACE=Pixels
LOOP= Integer
SCROLLAMOUNT= Integer
SCROLLDELAY= Integer
DATAFLD= string (field name)
DATASRC= string (data source ID)
DATAFORMATAS=string
TRUESPEED
SCRIPTING EVENTS=string

Description:

"Creates a scrolling text marquee."

"The default width of the MARQUEE element is equal to the width of its parent element. When a MARQUEE is in a TD that does not specify a width, you should explicitly set the width of MARQUEE. If neither the MARQUEE nor the TD has a width specified, the marquee is collapsed to a 1-pixel width."

"To create a vertically scrolling marquee, set its scrollLeft property to 0. To create a horizontally scrolling marquee, set its scrollTop property to 0, overriding any script setting."

"The scrollLeft and scrollTop properties are read-only while the marquee is scrolling. When not scrolling, scrollLeft is read/write for a marquee set to scroll horizontally and scrollTop is read/write for a marquee set to scroll vertically."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

TITLE

The TITLE attribute provides a title for an element and is commonly implemented as a "tooltip" on visual browsers, though many browsers lack support for TITLE. The attribute is most useful with A, LINK, IMG, and OBJECT elements, where it provides a title for the linked or embedded resource. Some examples follow:

TITLE is also helpful with the ABBR and ACRONYM elements to provide the long form of the abbreviation. Examples:

STYLE

The STYLE attribute allows authors to specify style rules inline for a single occurrence of an element. An example follows:

<P>A popular font for on-screen reading is <SPAN STYLE="font-family: Verdana">Verdana</SPAN>.</P>

When the STYLE attribute is used, a default style sheet language must be specified for the document by setting the Content-Style-Type HTTP header to the media type of the style sheet language. The previous example could use the following META element in the document's HEAD:

<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">

In most cases, use of the CLASS or ID attributes is a better choice than using STYLE since ID and CLASS can be selectively applied to different media and since they provide a separation of content and presentation that often simplifies maintenance.

ID

The ID attribute uniquely identifies an element within a document. No two elements can have the same ID value in a single document. The attribute's value must begin with a letter in the range A-Z or a-z and may be followed by letters (A-Za-z), digits (0-9), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

The following example uses the ID attribute to identify each of the first two paragraphs of a document:

<P ID=firstp>My first paragraph.</P>
<P ID=secondp>My second paragaph.</P>

The paragraphs in the example could have style rules associated with them through their ID attributes. The following Cascading Style Sheet defines unique colors for the two paragraphs:

P#firstp {
color: navy;
background: transparent
}

P#secondp {
color: black;
background: transparent
}

The paragraphs in the initial example could also be used as a target anchor for links:

<P>See <A HREF="#firstp">the opening paragraph</A> for more information.</P>

Note that most browsers do not support the ID attribute for link anchors. For current browsers, authors should use <A NAME>...</A> within the element instead of ID.

Since ID and NAME share the same name space, authors cannot use the same value for an ID attribute and a NAME attribute in the same document. Also note that while NAME may contain entities, the ID attribute value may not.

CLASS

The CLASS attribute specifies the element to be a member of one or more classes. Classes allow authors to define specific kinds of a given element. For example, an author could use <CODE CLASS=Java> when giving Java code and <CODE CLASS=Perl> when giving Perl code.

Unlike with the ID attribute, any number of elements can share the same class. An element may also belong to multiple classes; the CLASS attribute value is a space-separated list of class names.

Note that most current browsers do not support multiple classes. Such browsers typically ignore a CLASS attribute that specifies multiple classes.

The CLASS attribute is particularly useful when combined with style sheets. For example, consider the following navigation bar:

<DIV CLASS=navbar>
<P><A HREF="/">Home</A> | <A HREF="./">Index</A> | <A HREF="/search.html">Search</A></P>
<P><A HREF="/"><IMG SRC="logo.gif" ALT="" TITLE="WDG Logo"></A></P>
</DIV>

This example's use of the CLASS attribute allows style rules to easily be added. The following Cascading Style Sheet suggests a presentation for the preceding example:

.navbar {
margin-top: 2em;
padding-top: 1em;
border-top: solid thin navy
}

.navbar IMG { float: right }

@media print {
.navbar { display: none }
}

LANGUAGE

"Sets or retrieves the language in which the current script is written. "

"The language property can refer to any scripting language."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

LANG

The LANG attribute specifies the language of an element's attribute values and its content, including all contained elements that do not specify their own LANG attribute. While the LANG attribute is not widely supported, its use may help search engines index a document by its language while allowing speech synthesizers to use language-dependent pronunciation rules. As well, visual browsers can use the language's proper quotation marks when rendering the Q element.

The attribute value is case-insensitive, and should be specified according to RFC 1766; examples include en for English, en-US for American English, and ja for Japanese. Whitespace is not allowed in the language code.

Use of the LANG attribute also allows authors to easily change the style of text depending on the language. For example, a bilingual document may have one language in italics if rendered visually or a different voice if rendered aurally. The HTML of such a document might be as follows:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
<TITLE>Welcome - Bienvenue</TITLE>
<H1>
<SPAN LANG=en>Welcome</SPAN> -
<SPAN LANG=fr>Bienvenue</SPAN>
</H1>
<P LANG=en>This paragraph is in English.</P>
<P LANG=fr>Ce paragraphe est en français.</P>
...

A document's primary language may be set using the LANG attribute on the HTML element, or, alternatively, by using the Content-Language HTTP header.

ALIGN

The ALIGN attribute, deprecated in HTML 4.0, specifies the alignment of the marquee. The values top, middle, and bottom specify the marquee's position with respect to surrounding content on its left and right.

The other ALIGN values, left and right, specify a floating marquee; the marquee is placed at the left or right margin and content flows around it. To place content below the marquee, use <BR CLEAR=left|right|all> as appropriate.

BACKGROUND

The BACKGROUND attribute suggests a background image for tiling on the marquee area.

BEHAVIOR

"Sets or retrieves how the text scrolls in the marquee."

Allowed values include:

"

"

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

BGCOLOR

"Sets or retrieves the background color behind the object."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

DIRECTION

"Sets or retrieves the direction in which the text should scroll."

Allowed values include:

"

"

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

WIDTH

"Sets or retrieves the width of the object."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

HEIGHT

"Sets or retrieves the height of the object."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

VSPACE & HSPACE

The HSPACE and VSPACE attributes allow an author to suggest horizontal gutters and vertical gutters, respectively, around objects. The value must be in pixels and applies to both sides of the object.

LOOP

"Sets or retrieves the number of times a MARQUEEwill play."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

Setting a value of 0 or -1 causes the marquee to loop infinitely.

SCROLLAMOUNT

"Sets or retrieves the number of pixels the text scrolls between each subsequent drawing of the marquee."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

If not explicitly set, this value will be 6.

SCROLLDELAY

"Sets or retrieves the speed of the marquee scroll. "

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

If not explicitly set, this value will be 85.

DATAFLD

"Sets or retrieves which field of a given data source, as specified by the dataSrc property, to bind to the specified object. "

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

DATASRC

"Sets or retrieves the source of the data for data binding."

"The property takes a string that corresponds to the unique identifier of a data source object (DSO) on the page. The string must be prefixed by a number sign (#)."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

DATAFORMATAS

"Sets or retrieves how to render the data supplied to the object."

Possible values include:

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

TRUESPEED

"Sets or retrieves whether the position of the marquee is calculated using the scrollDelay and scrollAmount properties and the actual time elapsed from the last clock tick."

When NOT set (FALSE) : "Marquee computes movement based on 60-millisecond ticks of the clock. This means every scrollDelay value under 60 is ignored, and the marquee advances the amount of scrollAmount each 60 milliseconds. For example, if scrollDelay is 6 and scrollAmount is 10, the marquee advances 10 pixels every 60 milliseconds."

When set (TRUE) : "Marquee advances the pixel value of scrollAmount by the number of milliseconds set for scrollDelay. For example, the marquee would advance 10 pixels for every 6 milliseconds if scrollDelay is 6, scrollAmount is 10, and the value of trueSpeed is true."

(From the Microsoft MSDN Online Web Workshop - HTML References (Elements))

Scripting Events

A number of attributes that define client-side events are common to most elements. The attribute value is a script--typically a function call or a few short statements--that is executed when the event occurs. The value may contain entities (e.g., &quot;).

The following example features JavaScript code to handle two events of a submit button, giving the user a reminder in the status bar when the mouse moves over the button and clearing the status bar when the mouse moves away. Note that the attribute values are delimited by single quotes since double quotes are used within them.

<INPUT TYPE=submit ONMOUSEOVER='window.status="Did you fill in all required fields?";' ONMOUSEOUT='window.status="";'>

When an event attribute is used, a default scripting language must be specified for the document by setting the Content-Script-Type HTTP header to the media type of the scripting language. The previous example could use the following META element in the document's HEAD:

<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">

The common event attributes are device-dependent and largely tailored for the graphical user interface. The available events are as follows:

More Information


Sausage Software and the Web Design Group

Copyright © 1998 Sausage Software & Liam Quinn. All rights reserved.

Maintained by Jarrod Durnan